// 导入公共的less文件
@import './common.less';
@color:red;

.box {
    // @bgc:pink;
    width: 500px;
    height: 800px;
    color: @color;
    border: 2px solid @color;
    background-color: @bgc;
    .goods-name {
        margin: 5px;
        width: 100px;
        border: 2px solid #237c17;
        height: 40px;
        padding: 4px;
    }
    .title {
        margin: 5px;
        width: 100px;
        border: 2px solid #827ab3;
    }
    .list {
        list-style-type: none;
        // &:引用父选择器
        &-item {
            line-height: 50px;
            padding: 4px;
            border: 1px solid orange;
            &:hover {
                font-size: 30px;
            }
        }
        
    }

    .footer {
        font-size: 30px;
        text-align: center;
        background-color: brown;
    }


    .nav {
        .flex-c-c(); // 导入mixin
        width: 180px;
        height: 180px;
        border: 2px solid #ccc;
        margin: 20px auto;
    }

    .star {
        .flex-c-c();
        justify-content: center;
        align-items: center;
        width: 180px;
        height: 180px;
        border: 2px solid green;
        margin: 0 auto;
    }
}
